<template>
	<section>
		<nav class="cart1-nav">
			<!--<a :class="{curr: tebshow==0}" href="javascript:;" @click="tebSwitch(0)">苏鲜生商品({{this.$store.state.sufreshCartsNumber}})</a>
			<a :class="{curr: tebshow==1}" href="javascript:;" @click="tebSwitch(1)">易购商品({{this.$store.state.centerCartsNumber}})</a>-->
			<router-link to="/cart1/" exact replace>苏鲜生商品({{ suNumber }})</router-link>
			<router-link to="/cart1/center" exact replace>易购商品({{ centerNumber }})</router-link>
		</nav>
		<!--<a class="edit">编辑</a>-->
		<div class="tabs-content cart1-content">
			<router-view></router-view>
		</div>
	</section>
</template>

<script>
import { mapGetters, mapActions } from 'vuex'

export default {
	name: 'cart',
	data(){
		return {
			tebshow: 0
		}
	},
	created(){
		

		this.$store.commit('clearvolumeinfo')

	},
	components: { },

	methods: {
		
	},
	computed: {
		...mapGetters({
			goods: 'allGoods'
		}),

		suNumber(){
			return parseInt(this.$store.state.sufreshCartsNumber)>99?'99+':this.$store.state.sufreshCartsNumber
		},

		centerNumber(){
			return parseInt(this.$store.state.centerCartsNumber)>99?'99+':this.$store.state.centerCartsNumber
		}

	}
}
</script>


<style lang="scss" scoped>
	@function _($px) {
		$rem: $px/50;
		@return #{$rem}rem;
	}
	section{
		background-color: #f1f1f1;
	}
	nav{
		background-color: #fff;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index:100;
		text-align: center;
		padding: _(10) 0;
		font-size: 0;
		a{
			width: _(250);
			height: _(80);
			line-height: _(80);
			display: inline-block;
			border-radius: _(8) 0 0 _(8);
			border: 1px solid #ff782d;
			font-size: _(30);
			color: #ff782d;
			&.router-link-active{
				background-color: #ff782d;
				color: #fff;
			}
			&:last-child{
				border-radius:0 _(8) _(8) 0;
			}
		}
	}
	.tabs-content{
		padding-top: _(100)
	}

	.m-cb {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		input[type=checkbox] {
			position: absolute;
			left: 0;
			top: 0;
			opacity: 0;
			width: .88rem;
			height: .88rem;
			cursor: pointer;
		}
		i {
			float: left;
			width: .88rem;
			height: .88rem;
			background: url("") no-repeat;
			background-size: contain;
			margin-right: 5px;
		}
		input[type=checkbox]:checked+i {
		    background-image: url("")
		}
	}

</style>
